<!DOCTYPE html>
<html lang="en">
<head>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>增加好友</title>
    <link href="../../css/base.css" rel="stylesheet">
    <link href="../../css/communication.css" rel="stylesheet">
</head>
<body id="add-friends">
<div class="container">
    <div class="head">
        <div><i class="icon iconfont icon-jiantou1"></i>通讯录</div>
        <h2>新的朋友</h2>
        <a>添加朋友</a>
    </div>

    <div class="content-container">
        <input id="name" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;微信号/手机号" />
        <div class="btn-bar">
            <div><i class="icon iconfont icon-shouji"></i><a>添加手机联系人</a></div>
            <div><i class="icon iconfont icon-weixin"></i><a>添加微信联系人</a></div>
        </div>
        <ul class="content-list">
            <li>
                <img src="">
                <div class="box">
                    <h3>某某某（1234）</h3>
                    <p>测试测试测试</p>
                </div>
                <div class="operation">添加</div>
            </li>
            <li>
                <img src="">
                <div class="box">
                    <h3>某某某（1234）</h3>
                    <p>测试测试测试</p>
                </div>
                <div class="operation active">已添加</div>
            </li>
            <li>
                <img src="">
                <div class="box">
                    <h3>某某某（1234）</h3>
                    <p>测试测试测试</p>
                </div>
                <div class="operation">添加</div>
            </li><li>
            <img src="">
            <div class="box">
                <h3>某某某（1234）</h3>
                <p>测试测试测试</p>
            </div>
            <div class="operation">添加</div>
        </li>

        </ul>

    </div>

</div>

<script src="../../js/rem.js"></script>
<script src="../../js/lib/jquery.js"></script>
<script>
    /*输入框*/
    $('.content-container input').bind('input propertychange', function() {
        if( $(this).val()=='' ){
            $(this).css('background-image','url(../../images/search.png)')
        }else{
            $(this).css('background-image','none')
        }
    });


</script>
</body>
</html>